/*
    webpack.config.js webpack配置文件

    作用：指示webpack干哪些活(当你运行webpack指令时，会加载里面的配置)

    所有构建工具是都基于nodejs平台运行的，模块化默认采用commonjs
*/
//resolve 用来拼接绝对路径的方法
const {resolve} = require('path')

module.exports = {
    //入口起点
    entry:'./src/index.js',
    //输出
    output:{
        //输出文件名称
        filename:'built.js',
        //输出路径
        //__dirname nodejs的变量，代表当前文件的绝对路劲
        path:resolve(__dirname,'build')
    },
    //loader的配置
    module:{
        rules:[
            //详细loader配置
            //不同的文件必须配置不同loader
            {
                //匹配哪些文件
                test:/\.css$/,
                //使用哪些loader进行处理
                use:[
                    //use数组的执行顺序：从右到左
                    //创建style标签,将js中的样式资源插入到html header中
                    'style-loader',
                    //将css文件变成commonjs模块加载到js中,内容为样式字符串
                    'css-loader'
                ]
            },
            {
                //匹配哪些文件
                test:/\.less$/,
                //使用哪些loader进行处理
                use:[
                    //use数组的执行顺序：从右到左
                    //创建style标签,将js中的样式资源插入到html header中
                    'style-loader',
                    //将css文件变成commonjs模块加载到js中,内容为样式字符串
                    'css-loader',
                    //将less文件编译成css文件
                    'less-loader'
                ]
            }
        ]
    },
    plugins:[
        //详细plugins配置
    ],
    //模式
    mode:"development", //开发模式
    // mode:"production" //生产模式
}